<script setup lang="ts">
import { ETimeUnit } from '@/enum';
const props = defineProps<{ data: IOrderDetailInfo }>();
</script>

<template>
  <view class="mb-12px">
    <van-cell-group inset>
      <van-cell use-label-slot :title="props.data.timingType === 1 ? '固定时长' : '非固定时长'">
        <view slot="right-icon">
          <van-tag v-if="props.data.timingState === 1" type="warning">计时使用中</van-tag>
          <van-tag v-if="props.data.timingState === 2" type="success">计时结束</van-tag>
          <van-tag v-if="props.data.timingState === 3" type="danger">超额结束</van-tag>
        </view>
        <view slot="label">
          <van-cell v-if="props.data.timingType === 1" title="可用时长" :value="props.data.rentTime! + ETimeUnit[props.data.rentUnit]"></van-cell>
          <van-cell v-if="props.data.timingType === 2" title="起步价" :value="props.data.startFee + '元'"></van-cell>
          <van-cell title="开始时间" :value="props.data.rentBeginDate || '未开始'"></van-cell>
          <van-cell title="结束时间" :value="props.data.rentEndDate || ''"></van-cell>
          <van-cell v-if="props.data.timingType === 1" title="超时计费方式" :value="props.data.renewTime! + ETimeUnit[props.data.rentUnit] + '/' + props.data.renewPrice + '元'"></van-cell>
          <van-cell v-if="props.data.timingType === 2" title="计费方式" :value="props.data.rentTime! + ETimeUnit[props.data.rentUnit] + '/' + props.data.rentPrice + '元'"></van-cell>
          <van-cell title="说明:" :value="props.data.backFlag === 0 ? '如租赁消费金额超过押金，产品可自留，无需归还。' : '如租赁消费金额超过押金，订单将自动结束，产品必须归还。'"></van-cell>
        </view>
      </van-cell>
    </van-cell-group>
  </view>
</template>
